import { defineReactive } from './defineReactive.js'
import { def } from './utils.js'
import { arrayMethods } from './array.js'
import { observe } from './observe.js'
/* 将一个正常的object对象转化为每一层的每一个属性都是响应式的object（即属性可以被侦测）*/
export default class Observes {
  constructor(value) {
    // this.observe(value);
    // value.__ob__ = this;
    /* 构造函数中的this不是表示类本身，而是表示实例本身 */
    /* 给value对象，加了不可枚举的__ob__属性，值为Observes实例 */
    def(value, '__ob__', this, false);

    /* 检查value是数组还是对象 */
    if (Array.isArray(value)) {
      console.log(value);
      // 如果是数组，将这个数组的原型，指向arrayMethods(重新定义该数组的原型[value])
      Object.setPrototypeOf(value, arrayMethods);
      this.observeArray(value);
    } else {
      this.walk(value);
    }
  }
  walk (value) {
    for (let key of Object.keys(value)) {
      defineReactive(value, key)
    }
  }

  // 数组的遍历
  observeArray (arr) {
    for (let i = 0, l = arr.length; i < l; i++) {
      observe(arr[i])
    }
  }

  /* 新增对象的属性
    TODO：修改数组的数据，根据数组下标修改的
  */
  $set (obj, key, value) {
    defineReactive(obj, key, value)
  }
}